<template>
    <div class="fluid" @click="cancel">
        <img :src="result[0].logo" alt="" width="100px" height="100px" class="youhuilogo" @click.stop="show">
        <div class="fluidShow" v-if="showyouhui">
            <img :src="result[0].contentImg" alt="" @click.stop="show">
            <!-- <img src="../../assets/img/alert/8.png" alt="" class="cancel" @click="cancel"> -->
        </div>
    </div>
</template>
<script>
export default {
  data() {
    return {
      result: "",
      showyouhui: false
    };
  },
  mounted() {
    this.$ajax
      .post(this.Ipurl + "announcementInfo/selectPage", { homeShowFlag: 1 })
      .then(res => {
        this.result = res.data.dataInfo.records;
        console.log("youhui", res.data.dataInfo.records);
      });
  },
  methods:{
      show(){
          this.showyouhui = true
      },
      cancel(){
          this.showyouhui = false
      }
  }
};
</script>

<style scoped>
.fluid {
  width: 100%;
  height: 100%;
}
.youhuilogo {
  position: fixed;
  bottom: 0px;
  right: 50px;
}
.fluidShow {
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.8;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  text-align: center;
}

.fluidShow img{
  transform: translateY(30%);
}
</style>